<template>
  <div class="Loads flex row-center" v-if="loading || !loaded" style="margin-top: 0.2rem">
    <template v-if="loading">
      <div class="flex">
        <van-loading type="spinner" size="12px" />
        <span style="margin-left: 6px"> 正在加载中</span>
      </div>
    </template>
    <template v-else> 上拉加载更多 </template>
  </div>
</template>

<script>
export default {
  name: 'Loading',
  props: {
    loaded: Boolean,
    loading: Boolean
  }
}
</script>
<style>
.flex {
  display: flex;
  align-content: center;
}

.flex.row-center {
  justify-content: center;
  align-content: center;
}

.Loads .van-loading {
  display: flex;
  align-content: center;
  padding-top: 4px;
}
</style>
